<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml"
	xmlns:h="http://java.sun.com/jsf/html"
	xmlns:f="http://java.sun.com/jsf/core"
	xmlns:ui="http://java.sun.com/jsf/facelets"
	xmlns:p="http://primefaces.org/ui">

<ui:composition template="/pages/template/modelo.xhtml">
	<ui:define name="titulo">Friendzone</ui:define>
	<ui:define name="cabecalho">
		<div class="win-commandlayout win-ui-dark"
			style="background-color: #424251; height: 50px; float: left; width: 100%;">
			<div class="win-command">
				<h:graphicImage value="/resources/img/friendzone.png" />
			</div>
			<h:form styleClass="win-command"
				style="float:right; margin-top:-16px;">
				<h:commandLink actionListener="#{auth.logout}">
					<button class="win-command">
						<span class="win-commandicon win-commandring  icon-switch-2"></span>
					</button>
				</h:commandLink>
			</h:form>
		</div>
	</ui:define>
	<ui:define name="corpo">
		<h:form styleClass="modelo">
			<div>
				<h:commandLink action="/pages/pessoa/view-friendzone.zone"
					style="margin-left:265px;">
					<div class="listview-item small">
						<div class="listview-item-body">
							<h4 class="listview-item-heading">
								<h:graphicImage
									value="/resources/img/934932_470551206368561_109165739_n.jpg"
									styleClass="img-circle" style="width:300px; height:200px;" />
								<h:outputLabel value="#{friendzoneHome.usuarioLogado.nome}" />
							</h4>
						</div>
					</div>
				</h:commandLink>
			</div>
			<div style="width: 100%;">
				<p:dataGrid id="availableCars" var="relacionamento"
					value="#{friendzoneHome.relacionamentos}" columns="2" styleClass="bg-color-orange">
					<p:column>
						<p:panel id="pnl" header="#{relacionamento.nome}"
							style="text-align:center">
							<h:panelGrid columns="1" style="width:100%">
								<h:graphicImage value="/resources/img/titan.jpg"
									styleClass="img-circle" style="width:200px; height:100px;" />
							</h:panelGrid>
						</p:panel>
					</p:column>
				</p:dataGrid>
			</div>
		</h:form>
	</ui:define>
</ui:composition>

</html>